<template>
  <div style="margin: 0 20px; color: #fff; font-size: 30px">
    <i class="el-icon-full-screen" @click="setScreenfull" />
  </div>
</template>

<script>
import screenfull from 'screenfull' // 导入事先下载好的screenfull包
export default {
  name: 'FullScreen',
  data() {
    return {
      isFullscreen: false
    }
  },
  computed: {},
  created() {},
  methods: {
    setScreenfull() {
      if (!screenfull.isEnabled) {
        // 如果不允许进入全屏，发出不允许提示
        this.$message({
          message: '暂不不支持全屏',
          type: 'warning'
        })
        return false
      }
      screenfull.toggle()
      this.$message({
        message: '全屏开启',
        type: 'success'
      })
    }
  }
}
</script>
<style lang="less" scoped></style>
